<template>
  <div>
    <div ref="hello">
      <h1>名字：{{name}}</h1>
    </div>
    <el-button type="danger" @click="changeName">点击换名字</el-button>
    <h1>定时刷新页面，更新dom</h1>
  </div>
</template>

<script>
export default {
  name: "nextTickCpn",
  data(){
    return{
      name:'hh'
    }
  },
  mounted() {
    // setTimeout(()=>{
    //   console.log('setTimeout')
    //   //次时0点 执行下个小时整点刷新
    //   setInterval(() => {
    //     console.log('interval')
    //     location.reload()
    //   }, 5000);
    // },1000)
    console.log(this.$refs.hello)
    this.$nextTick(()=>{
      console.log(this.$refs.hello,'==')
    })
  },
  methods:{
    changeName(){
      this.name='qq'
      this.$nextTick(()=>{
        console.log(this.$refs.hello.innerText,'---')
      })
    }
  }
}
</script>

<style scoped>

</style>
